<template>
	<view>
		<view class="fullPage p30">
			<view class="container plr24 pb30 bf border-r1">
				<view class="flex_sb h80 ft26 bdb">
					<text>充电柜编号：{{ info.sn }}</text>
					<text>{{ info.operatorName }}</text>
				</view>
				<view class="flex_sb h80">
					<text>{{ info.siteName }}</text>
					<text class="c9 ft26">{{ info.distance || '--' }}km</text>
				</view>
				<view class="flex mb10">
					<view class="flex_a w40 h40 whn">
						<image src="/static/ic_dw_2x.png" mode="widthFix" style="width: 22upx;height: 24upx;"></image>
					</view>
					<text class="c9">{{ info.address }}</text>
				</view>
				<view class="flex_sb h100 mb30 plr30 bgf5">
					<view class="flex_a">
						空闲仓位：
						<view class="green">{{ info.blankNum }}</view>
					</view>
					<view class="flex_a">
						总仓位：
						<view class="ft30">{{ info.chanelNum }}</view>
					</view>
				</view>
				<view class="flex_a h100 mb100 plr30 bgf5">
					<!-- 充电套餐类型 1 :按时间收费 2：按功率收费  {{ info.chrMealPrice }} -->
					收费标准：{{ info.chrMealType == 2 ? '每度电量' : '每小时' }}
					<view class="pl10 danger"> {{ info.chrMealPrice || 0}} 元</view>
				</view>

				<view class="plr30 mb50">
					<u-button type="primary" shape="circle" throttle-time="2000" @click="opendoor">开启仓门</u-button>
				</view>
				<!-- <view class="" @click="anniu">
					按钮
				</view> -->
				<view class="plr24 ptb24 bd">
					<view class="h50">使用须知</view>
					<view class="c6">
						<u-parse :html="info.instructions"></u-parse>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		scanDevice,
		getInfoByAppId
	} from '@/api/user.js'
	import {
		mapState
	} from 'vuex'
	export default {
		data() {
			return {
				deviceNo: '',
				query: {},
				info: {},
				getInfoByAppIdObj: {},
				xinxi: [],
				xinxiss: [],
			}
		},
		onLoad(e) {
			if (e.deviceNo) {
				this.query = e
				this.deviceNo = e.deviceNo
			}
			console.log(this.tabbarstatus);
			this.getInfoByAppId()
			// console.log('这是this query', e);

		},
		onShow() {
			this.scanDevice()
		},
		computed: {
			...mapState({
				tabbarstatus: state => state.tabbar.tabbarstatus,
				deviceTypes: state => state.tabbar.deviceTypes
			})
		},
		methods: {
			// anniu() {
			// 	console.log('===========');
			// },

			// 消息订阅接口
			async getInfoByAppId() {
				this.xinxi = []
				this.xinxiss = []
				const res = await getInfoByAppId({
					appId: uni.getAccountInfoSync().miniProgram.appId
				})
				this.getInfoByAppIdObj = res.data
				// 获取value值 Object.values(this.getInfoByAppIdObj)
				// 便利value值成数组 this.xinxi

				let arrqq = Object.values(this.getInfoByAppIdObj)
				this.xinxi.push(arrqq[0])
				this.xinxi.push(arrqq[1])
				this.xinxiss.push(arrqq[2])
				this.xinxiss.push(arrqq[3])
				this.xinxi.push(arrqq[4])
				if (arrqq[5]) {
					this.xinxiss.push(arrqq[5])
				}

				// console.log('222222222222', this.xinxiss);
				console.log(222222222222, this.xinxi);
			},

			// 获取设备信息
			async scanDevice() {
				const res = await scanDevice(this.query)
				if (res.code != 200) {
					return this.confirm({
						content: res.msg || '操作失败',
						showCancel: false
					}).then(res => {
						this.back()
					})
				}
				this.info = res.data

				// 是否有充电订单
				if (res.data.isChrOrder == 1) {
					this.confirm({
						content: '检测到您已有电池在此设备中',
						confirmText: '结束订单',
						cancelText: '返回首页'
					}).then(result => {
						if (result.confirm) {
							this.routerLink({
								path: '/pages/user/myOrder/chargeDetail',
								query: {
									orderNo: res.data.orderNo
								}
							})
						} else {
							this.back()
						}
					})
					// 2 待支付订单
				} else if (res.data.isChrOrder == 2) {
					this.confirm({
						content: '检测到您有待支付订单，请先完成该订单',
						cancelText: '取消',
						confirmText: '去支付'
					}).then(result => {
						if (result.confirm) {
							this.routerLink({
								path: '/pages/user/myOrder/chargeDetail',
								query: {
									orderNo: res.data.orderNo
								}
							})
						} else {
							this.back()
						}
					})
				}
			},
			// 开启仓门
			async opendoor() {
				await this.subscribeMessage() // 订阅消息模板
				this.routerLink({
					path: '/pages/user/chargeEle/chargeProcess',
					query: {
						deviceId: this.info.deviceId
					}
				})
			},
			// 订阅消息模板
			async subscribeMessage() {

				console.log('this.deviceTypes:', this.deviceTypes, 'this.tabbarstatus:', this
					.tabbarstatus, this.xinxi, this.xinxiss);
				return new Promise((resolve, reject) => {
					if (this.tabbarstatus == '3' || this.tabbarstatus ==
						3) { //根据充电3还是换电1，提示的消息不一样

						uni.requestSubscribeMessage({

							tmplIds: this.xinxi,
							//  [
							// 	// 云禾换电 
							// 	// 'YCgPcRQrpo8B2qjziOkA42x_vwSyU2X49tVjao8Emao', //（充电充满通知/超时提醒）
							// 	// 'qJH-RuJBhIwGt2HDnSDfCRfjW7auQ7JRI3SBaapSyrA', //（充电开始通知）
							// 	// 'rsvctJcsUqZosk6o1LmjgF9J5KLwD8MIlyXb4Yes0D4' //（充电完成通知）
							// 	// 顺鼎物联
							// 	// 'r98KYoTGCMk0wgYwysi2ufGIWV0QXaH0mKoCMr7KfNQ', //充电完成通知
							// 	// 'qohMCtBJlXhxen5ufLPAWy4waknft_80ZIMgfddQLVI', //充电开始通知
							// 	// '7fVl5GbRc18bAl47f-k1R_FjdrHSuxln_fPxfCsF7Lw' //充电充满通知
							// ],
							success: res => {
								console.log('消息订阅成功哦', res);
								resolve(res)
							},
							fail: err => {
								resolve(err)
								console.log('消息订阅失败哦', err)
							}
						})

					} else if (this.tabbarstatus == '1' || this.tabbarstatus == 1) {

						uni.requestSubscribeMessage({
							tmplIds: this.xinxiss,
							// [
							// 	'k5rL7aNLYrEmwM4XS2FHhB7qZ2JlvxM6ZQZjoxnLvxo', //（租借成功通知）
							// 	'Bee6FBxFziLGFmwBgb5E36KyWJIY5R5pzyqooS1EbqU' //（归还成功通知）
							// ],
							success: res => {
								console.log('res====', res);
								resolve(res)
							},
							fail: err => {
								resolve(err)
								console.log(err)
							}
						})
						console.log(2222222222222, this.xinxiss);
					}
					// uni.requestSubscribeMessage({
					// 		tmplIds: [
					// 			'YCgPcRQrpo8B2qjziOkA42x_vwSyU2X49tVjao8Emao',//（充电充满通知/超时提醒）
					// 			'qJH-RuJBhIwGt2HDnSDfCRfjW7auQ7JRI3SBaapSyrA',//（充电开始通知）
					// 			'rsvctJcsUqZosk6o1LmjgF9J5KLwD8MIlyXb4Yes0D4',//（充电完成通知）
					// 			'k5rL7aNLYrEmwM4XS2FHhB7qZ2JlvxM6ZQZjoxnLvxo',//（租借成功通知）
					// 			'Bee6FBxFziLGFmwBgb5E36KyWJIY5R5pzyqooS1EbqU',//（归还成功通知）
					// 		],  
					// 	success: res => {
					// 		console.log('res====',res);
					// 		resolve(res)
					// 	},
					// 	fail: err => {
					// 		resolve(err)
					// 		console.log(err)
					// 	}
					// })
				})
			},
			navigation() {
				uni.openLocation({
					latitude: this.info.batteryReturnVo.lat * 1,
					longitude: this.info.batteryReturnVo.lng * 1,
					name: this.info.batteryReturnVo.siteName,
					address: this.info.batteryReturnVo.deviceAddress,
					success: () => {}
				})
			}
		}
	}
</script>

<style lang="scss" scoped></style>
